// 路由管理文件
import { element } from "prop-types";
import React, { lazy } from "react";
import { Navigate, useRoutes } from 'react-router-dom'

const Main = lazy(() => import('../pages/main/Main'))
const Classify = lazy(() => import('../pages/classify/Classify'))
const Location = lazy(() => import('../pages/location/Location'))
const Shopping = lazy(() => import('../pages/shopping/Shopping'))
const My = lazy(() => import('../pages/my/My'))
const Detail = lazy(() => import('../pages/detail/Detail'))
import TabBottom from '../components/tabBottom/TabBottom'


export default function WrapRoute() {
	// 使用useRoutes 渲染路由
	const routes = useRoutes([
		{
			path: '/',
			exact: true,
			element: <Navigate to='/home' />
		},
		{
			path: '/home',
			element: <TabBottom />,
			children: [
				{
					path: '/home',
					exact: true,
					element: <Navigate to='/home/main' />
				},
				{
					path: '/home/main',
					element: <Main />
				},
				{
					path: '/home/classify',
					element: <Classify />
				},
				{
					path: '/home/location',
					element: <Location />
				},
				{
					path: '/home/shopping',
					element: <Shopping />
				},
				{
					path: '/home/my',
					element: <My />
				}
				
			]
		},
		{
			path: '/detail/:id',
			element: <Detail />
		}
	])
	return routes
}


